<template>
    <div class="alarmConfiguration zy-content ">

      <div class=" search-box-layout">
        <Row :gutter="24">
          <Col span="4">
            <div>
              <p class="label">{{$t('ledger.state')}}</p>
              <div class="ipt">
                <Select v-model="searchParams.status" clearable :placeholder="`${$t('common.selectInfo')}`">
                  <Option v-for="(item, index) in statusList" :value="item.key" :key="index">
                    {{ item.value }}
                  </Option>
                </Select>
              </div>
            </div>
          </Col>
          <Col span="4">
            <div>
              <p class="label">{{$t('common.CreateBy')}}</p>
              <div class="ipt">
                <Select v-model="searchParams.createBy" filterable clearable :placeholder="`${$t('common.inputInfo')}`">
                  <Option v-for="(item,index) of createByOptions" :value="item.id" :key="index">{{ item.showName }}</Option>
                </Select>
              </div>
            </div>
          </Col>
          <Col span="4">
            <div>
              <p class="label">{{$t('common.CreateTime')}}</p>
              <div class="ipt">
                <DatePicker type="daterange"
                            placement="bottom-end"
                            :value="searchParams.dateRange"
                            :placeholder="`${$t('common.selectInfo')}`" clearable
                            @on-change="handleChangeDate"></DatePicker>
              </div>
            </div>
          </Col>
          <Col span="4">
            <div>
              <p class="label hide-label">--</p>
              <div class="ipt">
                <Button class="search-btn" type="primary"
                        v-has="'scoreList'"
                        @click="changeNum()">
                  {{$t('common.Query')}}
                </Button>
                <Button class="reset-btn" @click="reset()"
                        v-has="'scoreList'">
                  {{ $t('common.reset') }}
                </Button>
              </div>
            </div>
          </Col>
        </Row>
      </div>
        <div class="list-layout mt16">
          <div class="btns clear">

            <span class="title">{{ $t('common.listInformation') }}</span>
            <Button v-has="'scoreAddd'" @click="openAddDialog">{{$t('ledger.NewVersion')}}</Button>
            <Button @click="getTableColumns(columns)">{{ handleContextMenuStatus ? $t('显示操作栏'):$t('隐藏操作栏') }}</Button>
          </div>

          <div class="tableContent">
            <Table class="resizable-table" border @on-column-width-resize="onColumnWidthResize" ellipsis ref="selection" :loading="tableLoading" stripe :columns="columnsList" :data="tableData" height="520">
              <template slot-scope="{ row }" slot="action">
                <!-- 复制并添加 -->
                <span class="operationBtn" v-if="checkBtnPermission.scoreCopy" @click="copy(row)"><i class="iconfont zy-common-fuzhibingtianjia"></i>{{$t('ledger.CopyAndAdd')}}</span>
                <span class="operationBtn" v-if="checkBtnPermission.scoreUpdata && row.status!==0" @click="openEditDialog(row)"><i class="iconfont zy-common-bianji"></i>{{$t('common.Edit')}}</span>
                <span class="operationBtn" v-if="checkBtnPermission.scoreDeleted" @click="deleted(row)"><i class="iconfont zy-common-shanchu"></i>{{$t('common.Delete')}}</span>
                <!-- 预览 -->
                <span class="operationBtn" v-if="checkBtnPermission.scorePreview" @click="openViewDialog(row)"><i class="iconfont zy-common-yulan"></i>{{$t('ledger.Preview')}}</span>
              </template>
            </Table>
          </div>

          <div class="pageWrap mt16">
            <pageLeftTitle :total="pageHelper.total" />
            <Page :total="pageHelper.total"
                  :page-size="pageHelper.pageSize"
                  :page-size-opts="$variable.pageSizes"
                  :current="pageHelper.pageNum"
                  @on-change="changePageNum"
                  @on-page-size-change="changePageSize"
                  show-sizer show-total/>
          </div>
        </div>

        <add-or-edit-score-config ref="addOrEditScoreConfig" @change="changePageNum(1)"></add-or-edit-score-config>

        <view-score ref="viewScore"></view-score>
    </div>
</template>

<script>
//评分表配置
import {getUserSelect} from "../../../../api";
import {getTableData, copyAndAdd, deleteScoreConfig} from "../../../../api/dev-basic/score-config.js";
import AddOrEditScoreConfig from "./components/scoreCategory";
import ViewScore from './components/view.vue'
import toggleTableOperation from "@/mixins/toggleTableOperation";
export default {
    name: "scoringConfiguration",
  mixins:[toggleTableOperation],
    components: {
        AddOrEditScoreConfig,
        ViewScore,
    },
    data() {
        return {
            statusList: [{
                key: 0,
                value: '禁用'
            }, {
                key: 1,
                value: '启用'
            }],
            tableData: [],
            searchParams: {
                status: null,
                createBy: null,
                createTime: null
            },
            pageHelper: {
                pageNum: 1,
                pageSize: 10,
                total: 0,
                pageSizeOption: [10, 20, 30, 40]
            },
            columns: [
                {
                    //title: '状态',
                     title: `${ this.$t('ledger.state') }`,
                    key: 'status',
                    align: 'center',
                    minWidth: 120,
                    render: (h, params) => {
                        return h('div', params.row.status === 0 ? '禁用' : params.row.status === 1 ? '在用' : '')
                    },
                    resizable: true
                },
                {
                    //title: '版本号',
                     title: `${ this.$t('preliminary.Version') }`,
                    key: 'version',
                    minWidth: 100,
                    align: 'center',
                    render: (h, params) => {
                        return h('div', 'v' + params.row.version + '.0')
                    },
                  resizable: true
                },
                {
                   // title: '创建人',
                    title: `${ this.$t('common.CreateBy') }`,
                    key: 'createName',
                    minWidth: 100,
                    align: 'center',
                  resizable: true
                },
                {
                  //  title: '创建时间',
                   title: `${ this.$t('创建时间') }`,
                    key: 'createTime',
                    minWidth: 100,
                    align: 'center',
                  resizable: true
                },
                {
                    title: `${ this.$t('common.operation') }`,
                    slot: "action",
                    fixed: 'right',
                    minWidth: this.util.autoWidth(300,300),
                    align: "center",
                  resizable: true
                }
            ],
            tableLoading: true,
            checkBtnPermission: {},
            createByOptions: []
        }
    },
    methods: {
        handleChangeDate(value){
            this.searchParams.beginDate = value[0];
            this.searchParams.endDate = value[1];
            console.log(value);
            console.log(this.searchParams);
        },
        copy(row) {
            let params = {
                dmsDeviceScoreConfigId: row.id
            }
            copyAndAdd(params).then(res => {
                if (res.code === 200) {
                    this.searchList();
                    this.$Message.success(res.msg);
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            })
        },
        openEditDialog(row) {
            this.$refs.addOrEditScoreConfig.open(`${this.$t('ledger.ScoringConfig')}`, row.id);
        },
        deleted(row) {
            let params = {
                dmsDeviceScoreConfigId: row.id
            }
            deleteScoreConfig(params).then(res => {
                if (res.code === 200) {
                    this.searchList();
                    this.$Message.success(res.msg);
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            })
        },
        openAddDialog() {
            this.$refs.addOrEditScoreConfig.open(`${this.$t('ledger.ScoringConfig')}`);
        },
        openViewDialog(row) {
            this.$refs.viewScore.open(`${this.$t('ledger.ScoringConfig')}`, row.id);
        },
        reset(){
            this.searchParams = {};
            this.searchParams.dateRange = [];
            this.changeNum();
        },
        changeNum() {
            this.pageHelper.pageNum = 1;
            this.searchList();
        },
        changePageSize(pageSize) {
            this.pageSize = pageSize;
            this.searchList();
        },
        changePageNum(val) {
            this.pageHelper.pageNum = val;
            this.searchList();
        },
        searchList() {//查询列表
            this.tableLoading = true;
            let params = {
                pageNo: this.pageHelper.pageNum,
                pageSize: this.pageHelper.pageSize,
                ...this.searchParams
            };

            getTableData(params).then(res => {
                if (res.code === 200) {
                    this.tableData = res.data.list;
                    this.pageHelper.total = res.data.total;
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
                this.tableLoading = false;
            }).catch(err =>{
                console.log(err);
                this.tableLoading = false;
            })
        },
        getUserList() {
            getUserSelect().then(res => {
                if (res.code === 200) {
                    this.createByOptions = res.data.map(item => {
                        return {
                            ...item,
                            showName: item.empno + '----' + item.username
                        }
                    })
                    console.log('确认人')
                    console.log(this.createByOptions)
                } else {
                    this.createByOptions = []
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            }).finally(() => {
                this.loading = false
            })
        }
    },
    created() {

      this.getTableColumnsWidth(this.columns)

        this.searchList();
        this.getUserList();
        let itemList = JSON.parse(window.localStorage.getItem('USER_URI'))
        for (let item of itemList) {
            if (item.code === "scoreList") {
                this.checkBtnPermission.scoreList = true
            }
            if (item.code === "scoreCopy") {
                this.checkBtnPermission.scoreCopy = true
            }
            if (item.code === "scoreUpdata") {
                this.checkBtnPermission.scoreUpdata = true
            }
            if (item.code === "scoreDeleted") {
                this.checkBtnPermission.scoreDeleted = true
            }
            if (item.code === "scorePreview") {
                this.checkBtnPermission.scorePreview = true
            }
        }

    }
}
</script>

<style scoped lang="scss">

</style>

